<!--
 * @Author: your name
 * @Date: 2021-12-24 13:38:17
 * @LastEditTime : 2022-02-24 15:10:48
 * @LastEditors  : wty
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath     : \src\views\democraticEvaluation\components\EvaluationResData.vue
-->
<template>
  <div class="section_con" ref="sectionCon">
    <!-- 判断是否是空数据 -->
    <!--  && tableData.length != 0 -->
    <template v-if="detailsItem.assessmentStatus != '1' && detailsItem.assessmentTitle">
      <div class="down_header" v-if="!pageType" ref="downHeader">
        <p class="title">民主测评结果计票单</p>
        <p class="sub_title">（{{ detailsItem.assessmentSecondTitle }}{{ type == 2 ? '非领导' : '非公务员' }}成员）</p>
        <div class="sub_title1">
          {{ detailsItem.createByOrgName }}单位：{{ detailsItem.startTime }} ~
          {{ detailsItem.endTime }} 召开民主测评会，应到{{ detailsItem.sumPerson }}人，实到{{
            detailsItem.actuallyPerson
          }}人。
        </div>
        <div class="search_line">
          <el-radio-group v-model="type" @change="onTypeChange" v-if="typeOptions.length > 1">
            <el-radio v-for="item in typeOptions" :key="item.id" :label="item.id" :value="item.id">
              {{ item.name }}
            </el-radio>
          </el-radio-group>
          <el-button class="btnBorder" size="mini" type="primary" @click="onExport">导出</el-button>
        </div>
      </div>
      <div class="down_header" v-if="pageType == 'sum'" ref="downHeader">
        <p class="title">民主测评结果计票单（{{ detailsItem.assessmentSecondTitle }}）</p>
        <div class="sub_title1">
          {{ detailsItem.createByOrgName }}单位：{{ detailsItem.startTime }} ~
          {{ detailsItem.endTime }} 召开民主测评会，应到{{ detailsItem.sumPerson }}人，实到{{
            detailsItem.actuallyPerson
          }}人。
          <!-- xxx单位：2021年11月24日（8：00---9：00）召开民主测评会，应到35人，实到33人。 -->
        </div>
        <div class="search_line">
          <el-radio-group v-model="type" @change="onTypeChange1" v-if="typeOptions1.length > 1">
            <el-radio v-for="item in typeOptions1" :key="item.id" :label="item.id" :value="item.id">
              {{ item.name }}
            </el-radio>
          </el-radio-group>
          <el-button class="btnBorder" size="mini" type="primary" @click="onExport1">导出</el-button>
        </div>
      </div>
      <div class="down_body">
        <vxe-table
          class="mytable-scrollbar"
          border
          stripe
          :height="height"
          row-id="id"
          size="medium"
          resizable
          :scroll-y="{ enabled: false }"
          :data="tableData"
          :header-cell-class-name="headerStyle"
          :row-class-name="rowClass"
          highlight-hover-row>
          <!-- style="width: 50%" -->
          <vxe-column type="seq" title="序号" width="60" align="center"></vxe-column>
          <vxe-column field="userName" title="姓名" align="center" width="100"></vxe-column>
          <vxe-column field="level_1" title="“好”票数" align="center" min-width="120" sortable></vxe-column>
          <vxe-column field="level_2" title="“较好”票数" align="center" min-width="140" sortable></vxe-column>
          <vxe-column field="level_3" title="“一般”票数" align="center" min-width="140" sortable></vxe-column>
          <vxe-column field="level_4" title="“较差”票数" align="center" min-width="140" sortable></vxe-column>
          <vxe-column field="level_no" title="弃权票数" align="center" min-width="120" sortable></vxe-column>
          <vxe-column field="level_sum" title="总票数（实投/应投）" align="center" min-width="160">
            <template #default="{ row }">
              <span>{{ row.level_ed }} / {{ row.level_sum }}</span>
            </template>
          </vxe-column>
        </vxe-table>
      </div>
    </template>
    <Empty v-else style="height: auto">
      <slot>暂无数据</slot>
    </Empty>
  </div>
</template>

<script>
import {
  listAssessmentResult,
  listAssessmentResultOrgan,
  downAssessmentData,
  downAssessmentDataOrg,
} from '@api/modules/mzEvaluation.js'
import { getNoCivilNeedAssessByOrgId } from '@api/modules/grade.js'
export default {
  name: 'EvaluationResData',
  props: {
    pageType: String,
    searchParams: Object,
    assessmentId: String,
  },
  components: {},
  data() {
    return {
      tableData: [],
      height: 0,
      id: this.$route.query.id,
      detailsItem: {},
      typeOptions: [{ name: '非领导成员', id: 2 }],
      typeOptions1: [],
      type: 1,
      userInfo: JSON.parse(localStorage.PSKH_USERINFO),
    }
  },
  computed: {},
  watch: {
    searchParams: {
      handler(newVal, oldVal) {
        if (this.pageType === 'sum') {
          this.type = 1
          // 司法局和组织部有非领导成员
          // this.typeOptions1 = [
          //   { name: '领导成员', id: 1 },
          //   { name: '非领导成员', id: 2 },
          // ]
          // if (['02.01.0001.0002.0003', '02.01.0001.0002.0001'].includes(this.searchParams.id)) {
          //   this.typeOptions1 = [...this.typeOptions1, { name: '非公务员成员', id: 5 }]
          // }
          this.getNoCivilNeedAssessByOrgId('1', this.searchParams.id)
          this.initdata1()
        }
      },
      // 代表在wacth里声明了firstName这个方法之后立即先去执行handler方法
      immediate: true,
      deep: true,
    },
  },
  created() {
    this.id = this.$route.query.id || this.assessmentId
    // console.log(this.pageType)
  },
  mounted() {
    if (!this.pageType) {
      this.type = 2
      this.getNoCivilNeedAssessByOrgId('0', this.userInfo.loginPostInfo.orgId)
      this.initdata()
    }
  },
  methods: {
    /* 部门数据查询 */
    initdata() {
      listAssessmentResult({ assessmentId: this.id, type: this.type }).then(res => {
        const data = res.data
        this.tableData = data.resultVOS ? data.resultVOS : []
        this.detailsItem = { ...data }
        setTimeout(() => {
          if (this.$refs.downHeader) {
            this.$nextTick(() => {
              if (this.pageType === 'sum') {
                this.height = this.$refs.sectionCon.offsetHeight - this.$refs.downHeader.offsetHeight - 30
              } else {
                this.height = this.$refs.sectionCon.offsetHeight - this.$refs.downHeader.offsetHeight - 90
              }
            })
          }
        }, 100)
      })
    },
    /* 组织部数据查询 */
    initdata1() {
      listAssessmentResultOrgan({
        assessmentId: this.id,
        orgId: this.searchParams.id,
        title: this.searchParams.title,
        type: this.type,
        tenantId: this.searchParams.tenantId,
      }).then(res => {
        const data = res.data
        this.tableData = data.resultVOS ? data.resultVOS : []
        this.detailsItem = { ...data }
        setTimeout(() => {
          if (this.$refs.downHeader) {
            this.$nextTick(() => {
              if (this.pageType === 'sum') {
                this.height = this.$refs.sectionCon.offsetHeight - this.$refs.downHeader.offsetHeight - 30
              } else {
                this.height = this.$refs.sectionCon.offsetHeight - this.$refs.downHeader.offsetHeight - 90
              }
            })
          }
        }, 100)
      })
    },
    /* 导出 */
    onExport() {
      // console.log(this.checkResult);
      const req = `?assessmentId=${this.id}&type=2`
      const link = document.createElement('a')
      link.href = downAssessmentData(req)
      link.target = 'targetName'
      link.click()
    },
    /* 导出 */
    onExport1() {
      // console.log(this.checkResult);
      const req = `?orgId=${this.searchParams.id}&tenantId=${this.searchParams.tenantId}&title=${encodeURIComponent(
        this.searchParams.title
      )}&type=${this.type}`
      const link = document.createElement('a')
      link.href = downAssessmentDataOrg(req)
      link.target = 'targetName'
      link.click()
    },
    /* 监听角色切换 */
    onTypeChange() {
      this.initdata()
    },
    /* 监听角色切换 */
    onTypeChange1() {
      this.initdata1()
    },
    /* 头部样式 */
    headerStyle({ row, column, rowIndex, columnIndex }) {
      return 'headerStyle'
    },
    rowClass({ row, rowIndex }) {
      return 'rowClass'
    },
    getNoCivilNeedAssessByOrgId(type, orgId) {
      getNoCivilNeedAssessByOrgId({ oneParam: orgId }).then(res => {
        if (res.status === 200) {
          if (res.data.length > 0) {
            if (type === '0') {
              this.typeOptions = [
                { name: '非领导成员', id: 2 },
                { name: '非公务员成员', id: 5 },
              ]
            } else {
              this.typeOptions1 = [
                { name: '领导成员', id: 1 },
                { name: '非领导成员', id: 2 },
                { name: '非公务员成员', id: 5 },
              ]
            }
          } else {
            if (type === '0') {
              this.typeOptions = [{ name: '非领导成员', id: 2 }]
            } else {
              this.typeOptions1 = [
                { name: '领导成员', id: 1 },
                { name: '非领导成员', id: 2 },
              ]
            }
          }
        }
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.section_con {
  height: 100%;
  background-color: #fff;
  font-size: 14px;
  padding: 0 20px;

  .down_header {
    text-align: center;
    margin-bottom: 20px;
    .title {
      font-weight: 600;
      font-size: 22px;
      color: #333;
      margin-bottom: 15px;
    }
    .sub_title {
      color: #666;
      font-size: 16px;
      margin-bottom: 10px;
    }
    .sub_title1 {
      color: #666;
      position: relative;
      .el-button {
        position: absolute;
        right: 0;
        top: -5px;
      }
    }
    .search_line {
      display: flex;
      justify-content: space-between;
      margin-top: 10px;
      /deep/.el-radio-group {
        padding: 8px 0 6px;
        .el-radio {
          margin-right: 20px;
        }
      }
    }
  }
  .down_body {
    height: calc(100% - 200px);
    &.bodyHeight {
      height: calc(100% - 350px);
    }
  }
}
/deep/.headerStyle {
  color: #333;
  border-left: 1px solid #eee;

  th,
  div,
  span,
  p {
    font-size: 14px;
  }
}

/deep/.rowClass {
  td,
  div,
  span,
  p {
    font-size: 14px;
  }
}
/deep/.empty .img {
  margin-top: 0;
}
</style>
